import { speed } from '../../hook/common';

function getAvg(data: speed[], start: number, gap: number, filed: string = 'avg_time') {
    let totalTime = 0;
    if (!data[start + gap]) {
        return null;
    }
    for (let i = 0; i < gap; i++) {
        totalTime += data[start + i][filed];
    }
    return totalTime / gap;
}
export function getSpeedConfig(data: speed[], timeGranularity: string) {
    let xAxisData = [];
    let formatData = [];
    let timesData = [];
    if (!data || data.length === 0 || !timeGranularity) {
        return null;
    }
    switch (timeGranularity) {
        case '1分钟':
            data.forEach(item => {
                xAxisData.push(new Date(item.create_time).toLocaleString('chinese', { hour12: false }));
                formatData.push(item.avg_time);
                timesData.push(item.times);
            })
            break;
        case '5分钟':
            for (let i = 0; i < data.length; i = i + 5) {
                xAxisData.push(new Date(data[i].create_time).toLocaleString('chinese', { hour12: false }));
                formatData.push(getAvg(data, i, 5));
                timesData.push(getAvg(data, i, 5, 'times'));
            }
            break;
        case '1小时':
            for (let i = 0; i < data.length; i = i + 60) {
                xAxisData.push(new Date(data[i].create_time).toLocaleString('chinese', { hour12: false }));
                formatData.push(getAvg(data, i, 60));
                timesData.push(getAvg(data, i, 60, 'times'));
            }
            break;
        case '1天':
            for (let i = 0; i < data.length; i = i + (60 * 24)) {
                xAxisData.push(new Date(data[i].create_time).toLocaleString('chinese', { hour12: false }));
                formatData.push(getAvg(data, i, 60 * 24));
                timesData.push(getAvg(data, i, 60 * 24, 'times'));
            }
            break;
        default:
            break;
    }

    return {
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            left: 'center',
            bottom: 'bottom'
        },
        grid: {
            top: 'middle',
            left: '3%',
            right: '4%',
            bottom: '3%',
            height: '80%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: xAxisData,
            axisLine: {
                lineStyle: {
                    color: "#999"
                }
            }
        },
        yAxis: {
            type: 'value',
            splitLine: {
                lineStyle: {
                    type: 'dashed',
                    color: '#ddd'
                }
            },
            axisLine: {
                show: false,
                lineStyle: {
                    color: "#999"
                },
            },
            nameTextStyle: {
                color: "#999"
            },
            splitArea: {
                show: false
            }
        },
        series: [
            {
                name: '平均速度(ms)',
                type: 'line',
                data: formatData,
                lineStyle: {
                    normal: {
                        width: 2
                    }
                },
                itemStyle: {
                    normal: {
                        opacity: 0
                    },
                    emphasis: {
                        color: '#fff',
                        borderWidth: 3,
                        opacity: 1
                    }
                }
            },
            {
                name: '访问次数',
                type: 'line',
                data: timesData,
                lineStyle: {
                    normal: {
                        width: 2
                    }
                },
                itemStyle: {
                    normal: {
                        opacity: 0
                    },
                    emphasis: {
                        color: '#fff',
                        borderWidth: 3,
                        opacity: 1
                    }
                }
            }
        ]
    };
}